<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>规格列表</title>
</head>
<body>
<button type="button" class="btn btn-danger" onclick="delAll()">批量删除</button>
<button type="button" class="btn btn-primary" onclick="toAdd()">添加</button>
	<table class="table">
		<tr>
			<th>id</th>
			<th>名称</th>
			<th>规格选项</th>
			<th>操作</th>
		</tr>
		<!-- 使用jstl遍历info.list -->
		<c:forEach items="${info.list }" var="spec">
			<tr>
				<td>${spec.id }
					<input type="checkbox" class="chkbox" value="${spec.id }">
				</td>
				<td>${spec.specName }</td>
				<td><c:forEach items="${spec.optionList }" var="option"
						varStatus="i">
						<c:if test="${i.index>0 }">,</c:if> ${option.optionName }
					</c:forEach></td>
				<td>
					<button type="button" class="btn btn-success" onclick="toUpdate('${spec.id}')">修改</button>
					<button type="button" class="btn btn-danger" onclick="delById('${spec.id}')">删除</button>
				</td>
			</tr>
			
		</c:forEach>
	</table>
	<jsp:include page="/WEB-INF/view/common/pages.jsp"></jsp:include>
</body>
<script type="text/javascript">

	//跳转到修改页面
	function toUpdate(id){
		$("#workArea").load("./spec/toUpdate?id="+id);
	}
	
	
	function goPage(pageNum) {
		var url = "spec/list?pageNum=" + pageNum;
		$("#workArea").load(url);
	}
	
	//跳转到添加页面
	function toAdd(){
		$("#workArea").load("./spec/toAdd");
	}
	
	//根据id来删除
	function delById(id){
		$.get("./spec/delBach",{"ids":id},function(resp){
			if(resp){
				alert("删除成功!")
				goPage(1);
			}else{
				alert("删除失败!")
			}
		})
	}

//批量删除
	function delAll(){
		var arr = new Array();
		
		$(".chkbox:checked").each(function(){
				var val = $(this).val();
				arr.push(val);
			
		})
		//alert(arr.join(","))
		$.post("./spec/delBach",{ids:arr.join(",")},function(resp){

			if(resp){
				alert("success")
				//$("#workArea").load("./spec/list");
				goPage(1);
			}else{
				alert("fail!!")
			}

		})
		
	}
	
</script>
</html>